
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>{$vote_info.title}</title>
    <link rel="stylesheet" href="/static/css/admin.css">
    <link rel="stylesheet" href="/static/layui/css/layui.css">
    <script src="/static/layui/layui.js?=12321"></script>
    <script src="/static/js/js.js}"></script>
    <style>
        body {
            background: #f8f8f8;
        }
        .vote_ul {
            width: 800px;
            margin: 0 auto;
            background: #fff;
            padding: 30px;
            margin-top: 100px;
        }
        .vote_ul li {
            font-size: 14px;
            line-height: 28px;
            border-bottom: 1px solid #eee;
            padding: 20px;
        }
        .vote_ul li a {
            font-size: 18px;
            font-weight: bold;
        }
        .vote_ul li p {
            color: #999;
        }
    </style>
</head>
<body>
<form class="layui-form" action="">
    <div class="vote_ul">
        <fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
            <legend>{$vote_info.title}</legend>
        </fieldset>
        <div class="layui-form-item">
            {volist name="option_list" id="vo"}
            <div class="layui-input-block">
                {if condition="$hasInfo"}
                <span>{$vo.option_name} - <span style="color: #1E9FFF">{$vo.voters} 票</span> </span> {if condition="$hasInfo.vote_option_id eq $vo.id"}<span style="color: #f90">(你选择了) </span>{/if}
                {else /}
                <input type="radio" name="option" data-vote_id="{$vo.vote_id}"  data-option_id="{$vo.id}" value="{$vo.id}" title="{$vo.option_name}">
                {/if}
            </div>
            {/volist}
        </div>
        <hr>
        {if condition="!$hasInfo"}
        <button type="button" id="submit" style="margin-left: 100px;" class="layui-btn layui-btn-normal">提交</button>
        {/if}
    </div>
</form>
<script>
    layui.use(['form', 'layedit', 'laydate'], function() {
            var form = layui.form
                , layer = layui.layer,
                $ = layui.jquery;
            $('#submit').click(function(){
                let option = $('input[name="option"]:checked').val()
                if (option == undefined) {
                    layer.msg('请选择你要投票的选项')
                    return false;
                }
                $.post({
                    url: '/home/index/choose',
                    dataType: 'json',
                    data: {
                        vote_id: $('input[name="option"]:checked').data('vote_id'),
                        option_id: $('input[name="option"]:checked').data('option_id')
                    },
                    success(res){
                        if (res.status === 200) {
                            layer.msg('投票成功');
                            setTimeout(function(){
                                location.reload();
                            }, 500);
                        } else {
                            layer.msg(res.info)
                        }
                    },fail(){
                        layer.msg('异常')
                    }
                })
            })
        });
</script>
</body>
</html>